/**
 * 全局loading效果：合并多次loading请求，避免重复请求
 * 当调用一次startLoading，则次数+1；当次数为0时，则显示loading
 * 当调用一次endLoading，则次数-1; 当次数为0时，则结束loading
 */
import * as _ from 'lodash-es'
import { storeToRefs } from 'pinia'
import { useAppStoreWithOut } from '@/store/modules/app'
import { axiosVariable } from './setting'
const appStore = useAppStoreWithOut()

// 编写一个显示loading的函数 并且记录请求次数 ++
const startLoading = () => {
  const { t } = useI18n() // 国际化
  if (axiosVariable.loadingRequestCount === 0) {
    const { systemConfig } = storeToRefs(appStore)
    // 以服务的方式调用loading，默认是全屏loading，不支持单个请求自定义loading，控制loading的样式，否则可能出现多个请求同时请求，loading样式在变换的问题
    if (systemConfig.value.loadingType === 'body') {
      const options = {
        lock: true,
        text: t('common', 'loadingText'),
        background: systemConfig.value.isLight ? 'rgba(255, 255, 255, 0.7)' : 'rgba(0, 0, 0, 0.7)'
      }
      axiosVariable.loadingInstance = ElLoading.service(options)
    } else {
      appStore.setPageLoading(true)
    }
  }
  axiosVariable.loadingRequestCount++
}

// 编写一个隐藏loading的函数，并且记录请求次数 --
const endLoading = () => {
  // 以服务的方式调用的 Loading 需要异步关闭
  nextTick(() => {
    axiosVariable.loadingRequestCount--
    axiosVariable.loadingRequestCount = Math.max(axiosVariable.loadingRequestCount, 0) // 保证大于等于0
    if (axiosVariable.loadingRequestCount === 0) {
      hideLoading()
    }
  })
}

// 防抖：将 300ms 间隔内的关闭 loading 合并为一次。防止连续请求时， loading闪烁的问题。
// 因为有时会碰到在一次请求完毕后又立刻又发起一个新的请求的情况（比如删除一个表格行后立刻进行刷新）
// 这种情况会造成连续 loading 两次，并且中间有一次极短的闪烁。通过防抖可以让 300ms 间隔内的 loading 合并为一次，避免闪烁的情况。
const hideLoading = _.debounce(() => {
  const { systemConfig } = storeToRefs(appStore)
  if (systemConfig.value.loadingType === 'body') {
    if (axiosVariable.loadingInstance) {
      axiosVariable.loadingInstance.close()
      axiosVariable.loadingInstance = null
      axiosVariable.loadingRequestCount = 0
    }
  } else {
    appStore.setPageLoading(false)
  }
}, 300)

export { startLoading, endLoading, hideLoading }
